
.integral-center {
  .integral-con {
    .sign-in-list {
      position: relative;
      padding-top: 2.533333rem;
      ul {
        margin-left: .8rem;
        &:before {
          content: "";
          position: absolute;
          top: 2.906666rem;
          left: 1.5rem;
          width: 17rem;
          height: 1px;
          border-top: 1px dashed #ccc;
        }
      }
      .sign-item {

        &:first-child {
          margin-left: 0;
        }
        float: left;
        width: 1.6rem;
        margin-left: 1.2rem;
        text-align: center;
        i {
          position: relative;
          z-index: 10;
          display: block;
          margin: 0 auto;
          width: .746666rem;
          height: .746666rem;
          border: .053333rem solid #ccc;
          -webkit-border-radius: 100%;
          -moz-border-radius: 100%;
          border-radius: 100%;
          background-color: #fff;
        }
        i.cur {
          border-color: #0daeff;
          background-color: #0daeff;
        }
        i.cur-i {
          top: -.08rem;
          width: .966666rem;
          height: .966666rem;
          &:after {
            content: "";
            position: absolute;
            top: .106666rem;
            left: .2933333rem;
            width: .22rem;
            height: .5rem;
            border-right: .053333rem solid #fff;
            border-bottom: .053333rem solid #fff;
            -webkit-transform: rotate(45deg);
            -moz-transform: rotate(45deg);
            -ms-transform: rotate(45deg);
            -o-transform: rotate(45deg);
            transform: rotate(45deg);
          }
        }
        span.cur-sp {
          position: relative;
          top: -.22rem;

        }
        i.ico-active {
          &:before {
            content: '';
            position: absolute;
            top: -.733333rem;
            left: 50%;
            width: .72rem;
            height: .733333rem;
            background: url("../images/ico-active.png") no-repeat;
            background-size: .72rem .733333rem;
            -webkit-transform: translateX(-.2rem);
            -moz-transform: translateX(-.2rem);
            -ms-transform: translateX(-.2rem);
            -o-transform: translateX(-.2rem);
            transform: translateX(-.2rem);
          }
        }
        span {
          font-size: .533333rem;
          color: #999;
        }
      }
    }

    .msg-rule {
      margin-top: .96rem;
      header {
        padding-left: .8rem;
        padding-bottom: .1rem;
        font-size: .586666rem;
        color: #333;
      }
      .rulea-con {
        padding-left: 3.1rem;
        padding-right: .8rem;
        font-size: .586666rem;
        color: #999;
      }
    }

  }

  .coupon-list {
    margin-top: .8rem;
    > header {
      padding: 0 .8rem;
      height: 2.133333rem;
      line-height: 2.1333333rem;
      font-size: .8rem;
      color: #333;
      background-color: #fff;
      border-bottom: 1px solid #f2f2f2;

      > span {
        font-size: .586666rem;
        color: #999;
        margin-left: .2rem;
      }

      > a {
        float: right;
        font-size: .5866666rem;
        color: #0daeff;
      }

    }

    li {
      position: relative;
      padding: .8rem;
      font-family: "Microsoft Yahei";
      background-color: #fff;
      border-bottom: 1px solid #f2f2f2;
      .coupon-sum {
        width: 3.2rem;
        height: 3.2rem;
        line-height: 3.2rem;
        text-align: center;
        font-size: .8rem;
        color: #fff;
        background-color: #999;
        margin-right: .5333333rem;
        span {
          font-size: 1.333333rem
        }
      }
      .coupon-text {
        color: #999;
        font-size: .693333rem;
        .text-time {
          padding: 0 0 .32rem 0;
          font-size: .5866666rem;
        }
      }

      .convert-btn {
        position: absolute;
        right: .8rem;
        bottom: .8rem;
        width: 3.2rem;
        text-align: center;
        height: 1.066666rem;
        line-height: 1.066666rem;
        font-size: .64rem;
        color: #fff;
        background-color: #999;
      }

      &.coupon-cur {
        .coupon-sum {
          background-color: #ff6767;
        }
        .text-co, .text-int {
          color: #333;
        }
        .convert-btn {
          background-color: #ff6767;
        }
      }

    }

  }

}

/*轻提示*/
.light-hint {
  position: fixed;
  bottom: .8rem;
  left: 50%;
  padding: 3px 10px;
  font-size: .8rem;
  color: #666;
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -o-transform: translateX(-50%);
  transform: translateX(-50%);
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  background-color: #fff;
  -webkit-box-shadow: 0 0 10px 0 #ccc;
  -moz-box-shadow: 0 0 10px 0 #ccc;
  box-shadow: 0 0 10px 0 #ccc;

}

/*我的积分*/
.my-integral {
  .int-header {
    position: relative;
    padding-bottom: .8rem;
    background-image: -webkit-linear-gradient(to bottom, #ff7a7a, #ff3331);
    background-image: linear-gradient(to bottom, #ff7a7a, #ff3331);
    .rule-title {
      position: absolute;
      top: .533333rem;
      right: 1.066666rem;
      font-size: .586666rem;
      color: #fff;
      em {
        position: relative;
        right: .266666rem;
        display: inline-block;
        width: .6933333rem;
        height: .6933333rem;
        line-height: .6933333rem;
        text-align: center;
        border: .0533333rem solid #fff;
        -webkit-border-radius: 100%;
        -moz-border-radius: 100%;
        border-radius: 100%;
      }
    }
    .int-con {
      height: 7.466666rem;
      .ico-integral {
        position: relative;
        top: 2.4rem;
        left: 1.9rem;
        width: 2.3733333rem;
        height: 2.64rem;
        background: url("../images/ico-integral.png") no-repeat;
        background-size: 2.3733333rem 2.64rem;
      }
      .int-con-text {
        position: relative;
        top: 1.8rem;
        left: 3.2rem;
        color: #fff;
        > .text-tit {
          font-size: .693333rem;
        }
        > .text-num {
          line-height: 1.3;
          font-size: 1.92rem;
        }

      }
    }

    .int-button {
      > a {
        display: inline-block;
        padding-left: .8rem;
        width: 8.8rem;
        height: 3.7333333rem;
        margin-left: .8rem;
        color: #fff;

        .txt {
          padding-top: 1rem;
          font-size: .8rem;
        }
        .txt2 {
          font-size: .586666rem;
        }

        &.go-sign {
          background: url("../images/sign-bg.png") no-repeat;
          background-size: 8.8rem 3.7333333rem;
        }
        &.dis-coupon {
          background: url("../images/coupon-bg.png") no-repeat;
          background-size: 8.8rem 3.7333333rem;

        }
      }
    }
  }

  .int-detail {
    background-color: #fff;
    .int-detail-title {
      height: 2.133333rem;
      line-height: 2.133333rem;
      padding-left: .8rem;
      font-size: .8rem;
      color: #0daeff;
      border-bottom: 1px solid #f2f2f2;
    }
    > ul {
      padding-left: .8rem;
      li {
        padding-right: .8rem;
        font-size: .693333rem;
        border-bottom: 1px solid #f2f2f2;
        line-height: 1.2;
        .msg-text {
          margin-top: .3466666rem;
          color: #333;
        }
        .text-time {
          color: #999;
          font-size: .533333rem;
        }
        .int-count {
          width: 3.2rem;
          line-height: 2.133333rem;
          text-align: left;
          color: #ff6767;
          &.col-blue {
            color: #0daeff;
          }
        }
      }
    }

  }

}

/*我的优惠券*/
.aside-msg {
  display: block;
  margin: .533333rem .8rem;
  height: 2.133333rem;
  line-height: 2.133333rem;
  background: #fff url("../images/ico-arrow-r.png") no-repeat center right .8rem;
  background-size: .8rem;
  font-size: .64rem;
  color: #555;
  span {
    position: relative;
    top: .4rem;
    display: inline-block;
    width: 1.706666rem;
    height: 1.333333rem;
    margin-left: .5333333rem;
    margin-right: .266666rem;
    background: url("../images/ico-coupon-l.png") no-repeat center;
    background-size: 1.7066666667rem 1.333333rem;
  }
}

.discount-list {
  .my-coupon-item {
    padding: 0 .8rem;
    ul {
      li {
        position: relative;
        background-color: #fff;
        margin-bottom: .533333rem;
        overflow: hidden;
        .coupon-price {
          position: relative;
          width: 4.66666rem;
          height: 5.333333rem;
          line-height: 5.333333rem;
          background-color: #0daeff;
          color: #fff;
          font-size: .8rem;
          font-family: "Microsoft Yahei";
          text-align: center;
          em {
            font-size: 1.6rem;
          }
          .time-stale{
            position: absolute;
            top:.533333rem;
            left:-1.466666rem;
            width:4.66666rem;
            height:.8rem;
            line-height: .8rem;
            font-size: .5866666rem;
            color: #fff;
            background-color: #ff6767;
            text-align: center;
            -webkit-transform: rotate(-45deg);
            -moz-transform: rotate(-45deg);
            -ms-transform: rotate(-45deg);
            -o-transform: rotate(-45deg);
            transform: rotate(-45deg);
          }
        }

        .coupon-text {
          width: 13.733333rem;
          padding-left: .533333rem;
          color: #999;
          .condition-txt {
            margin-top: .8rem;
            font-size: .8rem;
            color: #333;
          }
          .condition-txt2 {
            margin-top: .8rem;
            font-size: .64rem;

          }
          .condition-time {
            font-size: .586666rem;
          }
        }
      }
    }

    &.coupon-have-used{

      .coupon-price{
        background-color: #999;
      }
      ul{
        li{
          background: #fff url("../images/coupons-have-used.png") no-repeat center right .533333rem;
          background-size: 4.773333rem 4.08rem;

          .condition-txt{
            color: #999;
          }
        }
      }

    }
    &.coupon-state{

      .coupon-price{
        background-color: #999;
      }
      ul{
        li{
          background: #fff url("../images/coupons-state.png") no-repeat center right .533333rem;
          background-size: 4.773333rem 4.08rem;

          .condition-txt{
            color: #999;
          }
        }
      }

    }

  }
}